import React, { useState, useEffect } from 'react';
import { Button } from 'antd';
import oneClickTip from '@/assets/oneClickTip.svg';
import { instructionDocument, plugInDownload } from '../../service';
import { downloadFileForFront } from '@/tjComponents/TjUpload/TjUploadContent';
import './index.less';

const InstallModal = (props = {}) => {
  const download = () => {
    plugInDownload().then((res: any) => {
      downloadFileForFront(res, `quick-login-extension.zip`);
    });
  };

  const downloadDoc = () => {
    instructionDocument().then((res: any) => {
      downloadFileForFront(res, `一键登录安装指南.pdf`);
    });
  };

  const refreshPage = () => {
    window.location.reload();
  };

  return (
    <div className="install-modal">
      <img src={oneClickTip} alt="t" />
      <div className="name">暂未安装插件</div>
      <div className="tips">
        请先安装插件，并按照<span onClick={downloadDoc}>操作说明</span>进行安装，若已安装请
        <span onClick={refreshPage}>刷新</span>页面
      </div>
      <div className="btns">
        <Button type="primary" onClick={download}>
          下载插件
        </Button>
      </div>
    </div>
  );
};

export default InstallModal;
